<template>
    <div class="hi-container">
        <el-card class="box-card">
            <div class="title">
                <h1>作业详情</h1>
                <br>
            </div>
            <el-form :model="form" ref="ruleForm">
                <el-form-item label="选择班级" :label-width="formLabelWidth">
                    <el-transfer v-model="value" :data="data"></el-transfer>
                </el-form-item>

                <el-form-item label="作业类型" :label-width="formLabelWidth">
                    <el-select v-model="j_type" placeholder="请选择" disabled>
                        <el-option
                                v-for="item in options"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="作业内容" :label-width="formLabelWidth">
                    <el-input type="textarea" v-model="form.context" placeholder="请填写作业内容"></el-input>
                </el-form-item>
                <el-form-item label="作业期限" :label-width="formLabelWidth">
                    <div class="block">
                        <el-date-picker
                                v-model="form.deadline"
                                type="datetime"
                                placeholder="选择日期时间">
                        </el-date-picker>
                    </div>
                </el-form-item>
                <el-form-item label="发布人" :label-width="formLabelWidth" >
                    <el-input v-model="form.pushMan" disabled autocomplete="off"></el-input>
                </el-form-item>
                <el-button type="primary" @click="onSubmit" style="display:block;margin:0 auto">提交</el-button>
            </el-form>
        </el-card>
    </div>
</template>

<script>
    import store from '../store'
    export default {
        name: "PublishJob.vue",
        data() {
            const generateData = _ => {
                const data = [];
                let arr = [];
                if(store.state.user.level>2){
                    this.$http
                        .get("teacher/getItsClass")
                        .then(result => {
                            result.body.forEach(item => {
                                data.push({
                                    label: item.cname,
                                    key: item.cid
                                });
                            });
                        });
                    return data;
                }else if(store.state.user.level>1){
                    this.$http
                        .get("teacher/getItsClassById?id="+store.state.user.uid)
                        .then(result => {
                            result.body.forEach(item => {
                                data.push({
                                    label: item.cname,
                                    key: item.cid
                                });
                            });
                        });
                    return data;
                }else{
                    return data;
                }
            };
            return {
                formLabelWidth:'120px',
                form:{
                    context:'',
                    deadline:'',
                    pushMan:store.state.user.username,
                    tid:store.state.user.uid
                },
                data: generateData(),
                value: [],
                j_type:1,
                options: [{
                    value: 1,
                    label: '图片img'
                }, {
                    value: 2,
                    label: '表格xls'
                }],
            }
        },
        methods: {
            onSubmit() {
                this.$http
                    .post("jobdemand/savejobdemand?tid="+this.form.tid+"&context="+this.form.context+"&cids="+this.value.join(",")+"&tname="+this.form.pushMan)
                    .then(result => {
                        this.form={
                            context:'',
                            deadline:'',
                            pushMan:store.state.user.username,
                            tid:store.state.user.uid
                        }
                        this.$message({
                            type: 'success',
                            message: '添加成功'
                        });
                    });
            },
            mounted() {

            },
        }
    }
</script>
<style lang="scss" scoped>
    .hi-container {
        .box-card {
            margin: 10px 130px 0px 120px;

            .title {
                h1 {
                    padding: 0;
                    margin: 0;
                }
            }
        }
    }

    .text {
        font-size: 14px;
    }

    .item {
        padding: 18px 0;
    }
</style>
